<template>
	<div class="">
		<div class="offliine">
			<van-swipe :autoplay="3000" lazy-render>
				<van-swipe-item v-for="image in images" :key="image">
					<img :src="image" />
				</van-swipe-item>
			</van-swipe>
		</div>
		<h3>今日主推</h3>
		<van-grid :border="false" :column-num="2">
			<van-grid-item @click="$router.push('../../Free')">
				<van-image
					src="https://www.pmdaniu.com/storages/124137/4fd65663c237204d6e2adfba9b23af2f-103297/images/%E5%8F%91%E7%8E%B0%E6%A0%B7%E5%BC%8F3/u724.svg" />
			</van-grid-item>
			<van-grid-item @click="$router.push('../../Free')">
				<span>小米还科技</span>
				<span>科技决定未来</span>
				<img
					src="https://www.pmdaniu.com/storages/124137/4fd65663c237204d6e2adfba9b23af2f-103297/images/%E9%A6%96%E9%A1%B5_1/p36.png">
				<span>小米还科技</span>
				<span>科技决定未来</span>
				<img
					src="https://www.pmdaniu.com/storages/124137/4fd65663c237204d6e2adfba9b23af2f-103297/images/%E6%90%9C%E7%B4%A2%E7%AD%9B%E9%80%89/p66.png">
			</van-grid-item>
		</van-grid>
		
	</div>
	<div class="gongnenglan">
		<van-grid direction="horizontal" :column-num="2">
			<van-grid-item v-for="item in itemsb" :key="item.id" @click="$router.push({path:'/goods_detail',query:{id:item.id}})">
				<template #text>
					<img
						:src="item.image">
					<div>
						<span>我的大手机来啦</span>
						<span>2020-09-09</span>
					</div>
				</template>
			</van-grid-item>
		</van-grid>
	</div>
	<van-empty image-size="100" description="没有更多了哦" />
</template>

<script setup>
import { ref } from 'vue';
import { getHomeData } from '../../../api/home'

const dizhi = 'https://www.pmdaniu.com/storages/124137/4fd65663c237204d6e2adfba9b23af2f-103297/images/%E5%8F%91%E7%8E%B0%E6%A0%B7%E5%BC%8F1/'
const images = ref([
   dizhi+'u616.jpg',
   dizhi+'u619.jpg',
   dizhi+'u618.jpg',
   dizhi+'u617.jpg',
   dizhi+'u619.jpg',
])
const itemsb = ref([])
async function foo(){
    const result=await getHomeData()
    const{items}=result
    itemsb.value.push(...items.list)
}
foo()
</script>

<style lang="less" scoped>
 img {
	width: 30%;
}
.my-swipe .van-swipe-item {
   color: #fff;
   font-size: 20px;
   line-height: 150px;
   text-align: center;
   background-color: #39a9ed;
}

 .offliine img {
   width: 100%;
   height: 100%;
}
.offliine {
	margin-top: 50px;
}
</style>

